<template>
  <a-spin :spinning="confirmLoading">
    <j-form-container :disabled="formDisabled">
      <a-form-model ref="form" :model="model" :rules="validatorRules" slot="detail">
        <a-row>
          <!-- <a-col :span="24">
            <a-form-model-item label="名称" :labelCol="labelCol" :wrapperCol="wrapperCol" prop="name">
              <a-input v-model="model.name" placeholder="请输入名称"></a-input>
            </a-form-model-item>
          </a-col> -->
          <a-col :span="12">
            <a-form-model-item label="项目" :labelCol="labelCol" :wrapperCol="wrapperCol" prop="projectId">
              <a-select :options="levelOneOptions" v-model="model.projectId " placeholder="请选择项目" @change="changeLevelOne"></a-select>
              <!-- <span style="color: red; font-size: 16px">请选择所属项目,此项为必填</span> -->
            </a-form-model-item>
          </a-col>
          <a-col :span="12">
            <a-form-model-item label="设备类型" :labelCol="labelCol" :wrapperCol="wrapperCol" prop="departId">
              <a-select :options="levelTwoOptions" v-model="model.departId" placeholder="请选择设备类型"  @change="changeLevelTwo"></a-select>
           
            </a-form-model-item>
          </a-col>
          <a-col :span="12">
            <a-form-model-item label="设备名称" :labelCol="labelCol" :wrapperCol="wrapperCol" prop="departId">
              <a-input :options="levelThreeOptions" v-model="model.userId  " placeholder="请输入设备名称"></a-input>
            
            </a-form-model-item>
          </a-col>
          <a-col :span="12">
            <a-form-model-item label="规格型号" :labelCol="labelCol" :wrapperCol="wrapperCol" prop="">
              <a-input :options="levelThreeOptions" v-model="model.userId  " placeholder="请输入规格型号"></a-input>
            </a-form-model-item>
          </a-col>
          <a-col :span="12">
            <a-form-model-item label="品牌" :labelCol="labelCol" :wrapperCol="wrapperCol" prop="address">
              <a-input v-model="model.address" placeholder="请输入品牌"></a-input>
            </a-form-model-item>
          </a-col>
          <a-col :span="12">
            <a-form-model-item label="类型" :labelCol="labelCol" :wrapperCol="wrapperCol" prop="">
              <a-select :options="levelThreeOptions" v-model="model.userId  " placeholder="请选择类型"></a-select>
            </a-form-model-item>
          </a-col>
          <a-col :span="12">
            <a-form-model-item label="设备位置" :labelCol="labelCol" :wrapperCol="wrapperCol" prop="">
              <a-select  v-model="model.address  " placeholder="请选择设备位置"></a-select>
            </a-form-model-item>
          </a-col>
          <a-col :span="12">
            <a-form-model-item label="设备状态" :labelCol="labelCol" :wrapperCol="wrapperCol" prop="">
              <a-select :options="levelThreeOptions" v-model="model.userId  " placeholder="请选择设备状态"></a-select>
            </a-form-model-item>
          </a-col>
          <a-col :span="12">
            <a-form-model-item label="是否可租借" :labelCol="labelCol" :wrapperCol="wrapperCol" prop="">
                <a-radio-group  v-model="model.userIdentity" >
            <a-radio :value="0">是</a-radio>
            <a-radio :value="1">否</a-radio>
          </a-radio-group>
            </a-form-model-item>
          </a-col>
          <a-col :span="12">
            <a-form-model-item label="采购日期" :labelCol="labelCol" :wrapperCol="wrapperCol" prop="">
            <j-date v-model="model.tickectDate"></j-date>

            </a-form-model-item>
          </a-col>
          <a-col :span="12">
            <a-form-model-item label="供应商" :labelCol="labelCol" :wrapperCol="wrapperCol" prop="">
              <a-select  v-model="model.userId  " placeholder="请选择供应商"></a-select>
            </a-form-model-item>
          </a-col>
          <a-col :span="12">
            <a-form-model-item label="联系电话" :labelCol="labelCol" :wrapperCol="wrapperCol" prop="">
              <a-input  v-model="model.telephone  " placeholder="请输入联系电话"></a-input>
            </a-form-model-item>
          </a-col>
          <a-col :span="12">
            <a-form-model-item label="保修期限" :labelCol="labelCol" :wrapperCol="wrapperCol" prop="">
              <a-input  v-model="model.userId  " placeholder="请输入保修期限"></a-input>

            </a-form-model-item>
          </a-col>
        </a-row>
      </a-form-model>
    </j-form-container>
  </a-spin>
</template>

<script>
import { httpAction, getAction } from '@/api/manage'
import { validateDuplicateValue } from '@/utils/util'

export default {
  name: 'WtWarehouseForm',
  components: {},
  props: {
    //表单禁用
    disabled: {
      type: Boolean,
      default: false,
      required: false,
    },
  },
  data() {
    return {
      model: {
        departId: '',
        userId:'',
        projectId:''
      },
      labelCol: {
        xs: { span: 24 },
        sm: { span: 5 },
      },
      wrapperCol: {
        xs: { span: 24 },
        sm: { span: 16 },
      },
      confirmLoading: false,
      validatorRules: { projectId:[{ required: true, message: '请选择项目!' }],},
      // housenameList: [],
      // housenameData: [],
      treeData1: [],
      // treeData2: [],
      // treeData3: [],
      levelOneOptions: [],
      // levelTwoOptions: [],
      // levelThreeOptions: [],

      url: {
        list: '/sys/user/list',
        add: '/materials/wtWarehouse/add',
        edit: '/materials/wtWarehouse/edit',
        queryById: '/materials/wtWarehouse/queryById',
      },
    }
  },
  computed: {
    formDisabled() {
      return this.disabled
    },
  },
  created() {
    //备份model原始值
    this.modelDefault = JSON.parse(JSON.stringify(this.model))
    this.loadTree()
  },
  methods: {
    add() {
      this.edit(this.modelDefault)
    },
    edit(record) {
      this.model = Object.assign({}, record)
      this.visible = true
      
      // getAction(this.url.list).then((res) => {
      //   if (res.success) {
      //     console.log(res)
      //     this.housenameData = []
      //     let treeList1 = res.result.records
      //     for (let a = 0; a < treeList1.length; a++) {
      //       let temp = treeList1[a]
      //       temp.isLeaf = temp.leaf
      //       this.housenameData.push(temp)
      //     }
      //     this.housenameList = [...this.housenameData].map((v) => {
      //       return {
      //         ...v,
      //         value: v.id,
      //         label: v.realname,
      //       }
      //     })
      
      //   }

      // })
      // getAction(`/sys/sysDepart/getDepartListByParentId?parentId=${this.model.projectId}`).then(res => {
      //   if (res.success) {
  
      //     this.treeData2 = []
      //     let treeList2 = res.result
      //     for (let a = 0; a < treeList2.length; a++) {
      //       let temp = treeList2[a]
      //       temp.isLeaf = temp.leaf
      //       this.treeData2.push(temp)
      //     }
         
      //     this.levelTwoOptions = [...this.treeData2].map((v) => {
      //       return {
      //         ...v,
      //         value: v.id,
      //         label: v.departName,
      //       }
      //     })
      //   }
      // })
      // getAction(`/sys/sysDepart/getUsersByDepartId?id=${this.model.departId}`).then((res)=>{
      //            if (res.success) {
  
      //         this.treeData3 = []
      //         let treeList3 = res.result
      //         for (let a = 0; a < treeList3.length; a++) {
      //           let temp = treeList3[a]
      //           temp.isLeaf = temp.leaf
      //           this.treeData3.push(temp)
      //         }
             
      //         this.levelThreeOptions = [...this.treeData3].map((v) => {
      //           return {
      //             ...v,
      //             value: v.id,
      //             label: v.realname,
      //           }
      //         })

      //       }
      //     })
    },
    // changeLevelOne(val) {
    //   // this.clearForm()
    //   this.model.departId = this.model.userId = ''
    //   this.levelThreeOptions = []
    // //  console.log('gfedw',val);
   
    //  this.getList('parentId', val)
    // },
    // changeLevelTwo(val) {
    //   // this.clearForm()
    //   this.model.userId = ''
    //   this.getList1('id', val)
     
    // },
    // getList(category, id) {
    //   getAction(`/sys/sysDepart/getDepartListByParentId?${category}=${id}`).then(res => {
    //     if (res.success) {
  
    //       this.treeData2 = []
    //       let treeList2 = res.result
    //       for (let a = 0; a < treeList2.length; a++) {
    //         let temp = treeList2[a]
    //         temp.isLeaf = temp.leaf
    //         this.treeData2.push(temp)
    //       }
    //      console.log('fdew',this.treeData2);
    //       this.levelTwoOptions = [...this.treeData2].map((v) => {
    //         return {
    //           ...v,
    //           value: v.id,
    //           label: v.departName,
    //         }
    //       })
    //     }
    //   })
    
      
    // },
    // getList1(category, id) {
     
    //   getAction(`/sys/sysDepart/getUsersByDepartId?${category}=${id}`).then((res)=>{
    //              if (res.success) {
  
    //           this.treeData3 = []
    //           let treeList3 = res.result
    //           for (let a = 0; a < treeList3.length; a++) {
    //             let temp = treeList3[a]
    //             temp.isLeaf = temp.leaf
    //             this.treeData3.push(temp)
    //           }
             
    //           this.levelThreeOptions = [...this.treeData3].map((v) => {
    //             return {
    //               ...v,
    //               value: v.id,
    //               label: v.realname,
    //             }
    //           })

    //         }
    //       })
    // },
    // clearForm(){
    //   this.model.departId=this.model.depid=this.model.userId  = ''
    // },
    loadTree() {
      getAction(`/sys/sysDepart/getDepartByOrgType?orgType=1`).then((res) => {
            if (res.success) {
  
              this.treeData1 = []
              let treeList1 = res.result
              for (let a = 0; a < treeList1.length; a++) {
                let temp = treeList1[a]
                temp.isLeaf = temp.leaf
                this.treeData1.push(temp)
              }
             
              this.levelOneOptions = [...this.treeData1].map((v) => {
                return {
                  ...v,
                  value: v.id,
                  label: v.departName,
                }
              })
              
              
            }
          })
          
    },
    submitForm() {
      const that = this
      // 触发表单验证
      this.$refs.form.validate((valid) => {
        if (valid) {
          that.confirmLoading = true
          let httpurl = ''
          let method = ''
          if (!this.model.id) {
            httpurl += this.url.add
            method = 'post'
          } else {
            httpurl += this.url.edit
            method = 'put'
          }
          // this.model.departId=this.model.id
          console.log('dewq',this.model);
          httpAction(httpurl, this.model, method)
            .then((res) => {
              if (res.success) {
                that.$message.success(res.message)
                that.$emit('ok')
              } else {
                that.$message.warning(res.message)
              }
            })
            .finally(() => {
              that.confirmLoading = false
            })
        }
      })
    },
  },
}
</script>